<template>
  <div class="basic-information">
    <div class="relevancy-account">
      <div class="account-header">
        <p>品牌授权信息</p>
      </div>
    </div>
    <div class="user-information" style="margin-top: 20px" v-if="merchantDetails">
      <div class="left">
        <el-form ref="form" label-width="80px" size="mini">
          <el-form-item label="创建时间:">
            <span>{{merchantDetails.created_at}}</span>
          </el-form-item>
          <el-form-item label="品牌定位:">
            <span v-if="merchantDetails.positioning == 1">专卖店</span>
            <span v-if="merchantDetails.positioning == 2">旗舰店</span>
            <span v-if="merchantDetails.positioning == 3">线上店</span>
            <span v-if="!merchantDetails.positioning">-</span>
          </el-form-item>
          <el-form-item label="服务人群:">
            <span>{{merchantDetails.target_user}}岁</span>
          </el-form-item>
        </el-form>
      </div>
      <div class="right">
        <el-form ref="form" label-width="80px" size="mini">
          <el-form-item label="授权书:">
            <el-image style="width: 60px;height: 80px;" v-if="merchantDetails.brand_authorization" :src="merchantDetails.brand_authorization" :preview-src-list="[merchantDetails.brand_authorization]" />
            <span v-else>-</span>
          </el-form-item>
          <el-form-item label="承诺书:">
            <el-image style="width: 60px;height: 80px;" v-if="merchantDetails.resident_commitment" :src="merchantDetails.resident_commitment" :preview-src-list="[merchantDetails.resident_commitment]" />
            <span v-else>-</span>
          </el-form-item>
        </el-form>
      </div>
    </div>
    <!--    关联账户-->
    <!-- <div class="relevancy-account">
      <div class="account-header">
        <p>审核信息</p>
        <p>
          <span style="margin-right: 4px">变更记录</span>
          <i class="el-icon-time" />
        </p>
      </div>
    </div> -->
    <!-- <div class="account-content">
      <div class="left">
        <el-form ref="form" label-width="80px" size="mini">
          <el-form-item label="审核类型:">
            <el-radio-group v-model="radio">
              <el-radio disabled :label="0">人工</el-radio>
              <el-radio disabled :label="1">系统</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="审核人员:">
            <span>王某某</span>
          </el-form-item>
        </el-form>
      </div>
      <div class="right">
        <el-form ref="form" label-width="80px" size="mini">
          <el-form-item label="审核时间:">
            <span>2024-04-25 17:24:15</span>
          </el-form-item>
          <el-form-item label="审核说明:">
            <el-input
              type="textarea"
              :autosize="{ minRows: 2, maxRows: 4}"
              placeholder="请输入内容"
              disabled
            />
          </el-form-item>
        </el-form>
      </div>
    </div> -->
  </div>
</template>
<script>
export default {
  props: {
    merchantDetails: {
      type: [String,Object],
      required: true,
      default: () => {}
    }
  },
  data() {
    return {
      radio: 0
    }
  }
}
</script>
<style scoped lang="scss">
.basic-information {
  .user-information {
    width: 100%;
    display: flex;
    justify-content: space-between;

    .left, .right {
      width: 48%;
    }
  }

  .relevancy-account {
    width: 100%;

    .account-header {
      border-left: 4px solid #4095e5;
      height: 36px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      background-color: #eeeeee;
      padding: 0 20px;
      box-sizing: border-box;

      p {
        font-size: 14px;
      }
    }
  }

  .account-content {
    width: 100%;
    margin-top: 20px;
    display: flex;
    justify-content: space-between;

    .left, .right {
      width: 48%;
    }
  }
}
</style>
